<template>
  <n-radio-group
    :value="modelValue"
    :size="option?.size"
    :disabled="option?.disabled"
    @update:value="(v) => (option?.onUpdate?.(v), $emit('update:modelValue', v))">
    <template v-for="item in dicData" :key="item.value">
      <component
        :is="option?.button ? NRadioButton : NRadio"
        :value="item.value"
        :label="item.label"
        :disabled="item.disabled" />
    </template>
  </n-radio-group>
</template>

<script lang="ts" setup>
import { NRadioGroup, NRadio, NRadioButton } from "naive-ui";
import { useDicData } from "./use-dic-data";
import type { RadioItemOption, RadioOption } from "../form-item-types";

const props = defineProps<{ modelValue: any; option?: RadioOption }>();

const { dicData } = useDicData<RadioItemOption>(props);
</script>
